<template>
  <div class="enterpriseTable">
    <div class="search">
      <search :isShowInput="false"
        :isReloadIvr="false"
        :showAdvSearch="false"
        :showMode="true"
        @add="add"
        @refresh="refresh"
        @turnPage="turnPage"
        @ModeChange="ModeChange"
        :currentPage="currentPage"
        :count="count"
        :pageSize="pageSize">
      </search>
    </div>
    <el-table :data="tableData" size="mini">
      <el-table-column v-for="(item, index) in tableHead" :prop="item.prop" :label="item.label" :key="index">
      </el-table-column>
      <el-table-column :label="$t('public.operate')">
        <template scope="scope">
          <el-button @click="editFun(scope.row)" type="text" size="small" class="update">{{$t('public.edit')}}</el-button>
          <el-button type="text" @click="delFun(scope.row)" size="small" class="del">{{$t('public.delete')}}</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
import search from '../base/search.vue'
import bus from '@/store/eventBus'
import { getDateTime, getCacheByKey } from '@/utils/m7Utils'
export default {
  name: 'enterpriseTable',
  data () {
    return {
      tableData: [],
      tableHead: [
        {prop: 'name', label: this.$t('questionnaire.name')},
        {prop: 'to_peer_name', label: this.$t('public.queues')},
        {prop: 'updateTime', label: this.$t('config.channel.lastUpdateTime')},
        {prop: 'authMode', label: this.$t('configLazyLoad.channel.enterpriseTip4')}
      ],
      currentPage: 1,
      pageSize: 10,
      authMode: "provider",
      count: 0,
      wechatUrl: ''
    }
  },
  methods: {
    editFun (data) {
      let editData = {
        wechatUrl: this.wechatUrl,
        editData: data,
        authMode: this.authMode
      }
      this.$emit('enterpriseEditFun', editData)
    },
    delFun (data) {
      this.$confirm(this.$t('configLazyLoad.channel.enterpriseTip5'), this.$t('public.delete'), {
        confirmButtonText: this.$t('public.delete'),
        cancelButtonText: this.$t('public.cancel'),
        cancelButtonClass: 'primary_btn',
        confirmButtonClass: 'primary_btn',
        type: 'warning'
      }).then(() => {
        this.$store.dispatch('removeWxEnterpriseConfig', {_id: data._id}).then((req) => {
          if (req.success) {
            this.$message.success(this.$t('configLazyLoad.public.deleteSuccess'))
            this.getTableData()
          }
        })
      })
    },
    add (authMode) {
      this.$emit('addFun', authMode)
    },
    refresh () {
      this.getTableData()
    },
    ModeChange (val) {
      this.authMode=val
      this.getTableData()
    },
    turnPage (val) {
      this.currentPage = val
      this.getTableData()
    },
    getTableData () {
      let sendData = {
        page: this.currentPage,
        limit: this.pageSize,
        authMode: this.authMode,
      }
      this.$store.dispatch('getCache', {type: 'mailQueues'}).then(res => {
        this.$store.dispatch('getWxEnterpriseConfigs', sendData).then(res => {
          if (res.list.length > 0) {
            res.list.forEach((item, index) => {
              if (item.updateTime) {
                item.updateTime = getDateTime(new Date(item.updateTime))
              }
              item.authMode = item.authMode === 'dev' ? this.$t('configLazyLoad.channel.enterpriseTip6') : this.$t('configLazyLoad.channel.enterpriseTip6')
              if (item.to_peer) {
                let peer = getCacheByKey('mailQueues', 'Exten', item.to_peer)
                res.list[index]['to_peer_name'] = peer ? peer.DisplayName : '--'
              }
            })
          }
          this.wechatUrl = res.wechatUrl || ''
          this.tableData = res.list
          this.count = res.count
          this.$emit('wechatUrl', this.wechatUrl)
        })
      })
    }
  },
  beforeMount () {
    this.getTableData()
    bus.$on('getTableData', () => {
        this.getTableData()
    })
  },
  destroyed () {
      bus.$off('getTableData')

    },
  components: {
    search
  }
}
</script>
<style lang="stylus" scoped>
  @import "../../../../../assets/common.styl"
    .enterpriseTable
      margin 25px
    .search
      border 1px solid #e7e7eb
      border-bottom none
</style>

